<template>
  <div id="passport-app">
    <animationNavBox>
      <itemForm />
    </animationNavBox>
    <itemPage>
      <component :is='pages[nowPage]' />
    </itemPage>
  </div>
</template>

<script>
import itemForm from '@/components/form/index.vue';
import resetPassword from '@/components/form/reset-password.vue';
import animationNavBox from '@/components/animation-item/index.vue';
import itemPage from '@/components/page-item/index.vue';
import { mapGetters } from 'vuex';
import { jumpingHttps } from '@/utils/index';

export default {
  components: {
    itemForm,
    animationNavBox,
    itemPage,
    resetPassword,
  },
  beforeCreate() {
    // 在生产环境下 判断https的跳转
    jumpingHttps();
  },
  computed: {
    ...mapGetters(['nowPage', 'pages']),
  },
  created() {
    this.$store.dispatch('verifyLogin');
  },
};
</script>

<style lang="less">
@import '~@/styles/media-max-600.less';
@import '~@/styles/media-max-960.less';
@import '~@/styles/media-min-961.less';
@import '~@/styles/variables.less';

#passport-app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: @pageBackground;
  color: #2c3e50;
  .base_background();
}
* {
  margin: 0;
  padding: 0;
}
.item-btn {
  cursor: pointer;
}
</style>
